import { Tabs, Col, Row, Spin } from 'antd';
import { FormattedMessage, connect, formatMessage } from 'umi';
import React, { Component } from 'react';
import styles from './index.less';
import Sale from './components/Sale'
import CrowdMonitor from './components/CrowdMonitor'

const { TabPane } = Tabs;

class Monitor extends Component {

  componentWillReceiveProps(){
    const { dispatch, currentUser } = this.props;
    // dispatch({
    //   type: 'stockMonitor/fetchTimeRange',
    //   payload:{
    //     name_code: 'common_time_series',
    //     time_type: '月度'
    //   }
    // })
  }

  componentDidMount() {
    // dispatch({
    //   type: 'stockMonitor/fetchInitData',
    // });
    const { dispatch, currentUser } = this.props;

    dispatch({
      type: 'stockMonitor/changeRegion',
      payload: currentUser
    });
  }

  componentWillUnmount(){
    const { dispatch, currentUser } = this.props;
    dispatch({
      type: 'stockMonitor/changeTabs',
      payload: '1'
    });
  }

  render() {
    const { dispatch, currentUser } = this.props;
    const { url_list = [] } = currentUser
    const currentUrl = url_list.filter(item => item.url === '/stockMonitor')
    const currentData = currentUrl.length ? currentUrl[0] : []

    const handChangeTab = key => {
      dispatch({
        type: 'stockMonitor/changeTabs',
        payload: key
      });
    }
    return (
      <div>
        <Tabs type="card" onChange={handChangeTab}>
          {currentData.modules && currentData.modules.map((item, index) => {
            //params是filterheader中的请求参数{purpose,staticts}

            if (item.key === 'deal') {
              return (
                <TabPane tab={item.name} key="1">
                  <Sale tab="1" params={item.params[0]}/>
                </TabPane>
              )
            }

            if (item.key === 'stockPeople') {
              return (
                <TabPane tab={item.name} key="2">
                  <CrowdMonitor tab="2" params={item.params[0]} />
                </TabPane>
              )
            }
          })}
        </Tabs>
      </div>
    );
  }
}

export default connect(({ loading, stockMonitor, user }) => ({
  stockMonitor,
  loading: loading.models.stockMonitor,
  tabKey: stockMonitor.tabKey,
  currentUser: user.currentUser,
}))(Monitor);
